<%@ page language="java" contentType="text/html; charset=ISO-8859-9"
    pageEncoding="ISO-8859-9"%>
<%@page import="translate.*"%>
<%@page import="reader.URLConnectionReader"%>
<%@page import="parser.HTMLParser"%>
<%@page import="edu.boun.cmpe.elele.cotrans.dbOperations.*" %>
<%@page import="java.util.ArrayList" %>
<%@page import="java.util.Iterator" %>


<html>
<head>
<title>translate</title>

<META http-equiv=content-type content="text/html" charset="iso-8859-9">
<META http-equiv=content-type content="text/html" charset="windows-1254">
<script language="JavaScript" src="js/jquery.js"></script>
<script language="JavaScript" src="js/jquery.wysiwyg.js"></script>
<script language="JavaScript" src="js/functions.js"></script>
<script language="JavaScript" src="js/jquery.sundaymorning.js"></script>
<script language="JavaScript" src="js/autoresize.jquery.js"></script>
<link rel="stylesheet" href="css/jquery.wysiwyg.css" type="text/css">
<link rel="stylesheet" href="css/jquery.sundaymorning.css" type="text/css">

<script language="javascript">
$(document).ready(function() {
		$('#translated').wysiwyg({

		controls : {
		separator04 : { visible : true },
		insertOrderedList : { visible : true },
		strikeThrough : { visible : true },
		underline : { visible : true },
		insertUnorderedList : { visible : true }
		}
		});


		$('#original').wysiwyg({
			controls : {
			separator04 : { visible : true },
			insertOrderedList : { visible : true },
			strikeThrough : { visible : true },
			underline : { visible : true },
			insertUnorderedList : { visible : true }
			}
		});


$('#dict .dic').sundayMorningReset();
		$('#dict .dic input[type=button]').click(function(evt) {
			$.sundayMorning(
				$('#dict textarea').val(),
				{ destination:'tr', menuLeft:evt.pageX, menuTop:evt.pageY},
				function(response) {
					$('#dict textarea').val(response.translation);
				}
			);
		});

		$('#dict textarea').autoResize({
		    // On resize:
		    onResize : function() {
		        $(this).css({opacity:0.8});
		    },
		    // After resize:
		    animateCallback : function() {
		        $(this).css({opacity:1});
		    },
		    // Quite slow animation:
		    animateDuration : 300,
		    // More extra space:
		    extraSpace : 40
		});

})
</script>


</head>
<body>
<%
	String link= request.getParameter("q");
        String userID= session.getAttribute("userid").toString();
        //String transID= request.getParameter("transID");
        //String transID = "1";

        //insert document to db
        DbOperations db= new DbOperations();
        Integer docID= db.insertDocument(link, "", 0);

        //insert translation to db
        db= new DbOperations();
        Integer transID=db.insertTranslation("", docID, 0, 0);

        //insert user translation to db
        db= new DbOperations();
        db.insertUserTranslation(userID, transID.toString());

        //original content
	    URLConnectionReader urlRead= new URLConnectionReader();
	    String htmlFrame= urlRead.parseWiki(link);

        //translated content
        TranslateContent t= new TranslateContent();
        String translated= t.translate(htmlFrame);

%>
<table>
    <tr>
        <td>
              <table>

                    <tr>
                    <td>

                        <!--<input type="text" id="invite" name="invite" value="Enter a user name">-->
                        <select id="invite" name="invite">
                            <option value=""></option>
                            <%
                            db= new DbOperations();
                            ArrayList<String> res= db.getAllUsers();
                            Iterator<String> it = res.iterator();
                            while(it.hasNext()){
                                String s= it.next();
                                System.out.println(s);
                            %><option value="<%=s%>"><%=s%></option><%
                            }
                            %>
                        </select>
                        <input type="button" id="inviteButton" name="inviteButton" value="Invite" onclick="InvitePerson()" />
                     </td>
                </tr>
             </table>
        </td>
        <td>
            <div align="left">
            Dictionary en -> tr :<div id="dict"><p class="dic">
            <textarea cols="50" rows="1">Enter word or phrase to translate</textarea>
            <input type="button" value="translate" />
            </p>
            </div>
            </div>
            <br>
        </td>



</tr>
            <tr>
                <td>

                     <textarea id="original" cols="%80" rows="%60" name="original" readonly="readonly">
                    <%=htmlFrame%>
                    </textarea>


                </td>
                <td>
                    <form id="translated_form">
                 <textarea id="translated" cols="%80" rows="%60" name="translated">
                  <%=translated%>

                </textarea>
                  </form>
                </td>
                <td>
                    Chat
                </td>
            </tr>
</table>

       <table align="right">
            <tr>
                <td>
                    <input type="hidden" name="transid" id ="transid" value="<%=transID%>"/>
                    <input style="margin-right: 15px;" id="save" name="save" type="button" value="Save" onclick="SaveTranslation()"/>

             <input style="margin-right: 15px;" id="savequit" name="savequit" type="button" value="Save&Quit" onclick="SaveandQuitTranslation()"/>
            <input id="done" name="done" type="button" value="Done" onclick="DoneTranslation()"/>
                </td>
            </tr>
        </table>

</body>
</html>